/* Стили страницы регистрации нового игрока, на которую пользователь
 * перенаправляется после клика по ссылке рефера (ютубер, тик-токер и т.п.)
 */

.suitable-device body {
	background:
        url(../img/bg_refreg_primary.png) no-repeat right 0% top 0%/100%,
        url(../img/bg_refreg_secondary.png) repeat right 0% top 0%/cover;
}

/* Ссылка для исправления неверной детекции Android-устройств. */
#fix-dev-detection-link {
    display: block;
    text-align: center;
    font-size: 1.25rem;
    color: #e4360d;
    padding: 1rem 1rem 2rem;
}


/*
 * КНОПКИ
 */


.primary-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    padding: 1.1rem .75rem;
    margin-top: 1.25rem;

    background: linear-gradient(90deg, #CE0E03 0%, #F75514 100%);
    border: 0;
    border-radius: 7px;
    box-shadow: 0 0 2.5rem #e4340da9;
    color: white;

    font-size: 1.0625rem;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}
.primary-btn img {
    margin-right: .5rem;
}

.primary-btn:hover {
    color: white;
}


/*
 * ЗАГОЛОВОК СТРАНИЦЫ
 */

.section-heading {
    color: white;
    font-family: Montserrat;
    font-size: 1.5rem;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    margin-top: 2.25rem;
    line-height: 1.26;
    padding: 0 .5rem;
}
.section-heading em {
    color: #e4360d;
    font-style: normal;
}


/*
 * ВИДЕО-РОЛИК ЮТУБЕРА
 */

 #referrer-video {
    margin: 2rem auto;
    border: 2px black solid;
    border-radius: 8px;
    display: flex;
    width: 100%;
    max-width: 350px;
 }


/*
 * ПРОМОКОД ЮТУБЕРА
 */

.referrer-promo {
    color: white;
}

.referrer-promo .promo-pic {
    position: relative;
    z-index: 2;

    /* Центрируем картинку по оси X */
    left:  0%;
    right: 0%;
    margin: 0 auto;

    display: block;
    max-width: 100%;
}

/* Заголовок */

.referrer-promo .heading {
    position: relative;
    z-index: 1;

    font-size: 1.25rem;
    line-height: 1.5;
    text-transform: uppercase;

    margin-top: 2rem;
    margin-bottom: 0;
}
.referrer-promo .heading em {
    font-style: normal;
    background: linear-gradient(to right, #ce0e03, #f75514);
    padding: .15rem .3rem;
    border-radius: 3px;
}


/* Динамическое содержимое промокода */

.referrer-promo .dyn-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 .5rem;
    margin-top: 2rem;
    margin-bottom: 0;

    color: white;
    font-size: 1.25rem;
    font-weight: bold;;
    text-align: center;
    text-transform: uppercase;
}


.referrer-promo .dyn-content ul {
    list-style-image: url("../img/ul_disc.png");
    color: #cfcfcf;
    font-size: 1rem;
    font-weight: 300;
    text-align: left;
    margin-bottom: .75rem;
}
.referrer-promo .dyn-content li {
    padding-bottom: .5rem;
}

.referrer-promo .dyn-content em {
    color: #e4360d;
    font-style: unset;
}


/*
 * СЕКЦИЯ "КАК НАЧАТЬ ИГРАТЬ"?
 */

.how-to-play {
    padding-bottom: 1.25rem;  /* Иначе след. элемент отображается поверх видео */
}

 /* Используем готовые стили с главной страницы, но не скрываем подпись к видео
  * с текстом "ПОСМОТРИТЕ ВИДЕО-ИНСТРУКЦИЮ".
  */
.kak_desc {
    display: block;
    font-size: .9rem;
    width: 12.5rem;
    height: 3.3rem;
}


/*
 * СЕКЦИЯ C СЧЕТЧИКОМ ИГРОКОВ И КНОПКОЙ ЗАГРУЗКИ ИГРЫ
 */

/* Кнопка "СКАЧАТЬ ИГРУ" */

.download-section {
    display: flex;
    flex-direction: column;
    max-width: 12.6875rem;
    margin: 2rem auto 0;
}

/* Счетчик игроков-онлайн */

.online-player-counter {
    position: relative;
    width: 100%;
    display: flex;
    flex-flow: column;
    background: rgba(62, 40, 36, 0.6);
    border-radius: 7px;
    padding: .5rem 0 .25rem;
}
.online-player-counter::before {
    content: "";
    width: 8.5rem;
    height: 2px;
    background-image: linear-gradient(180deg, #e4360d 0%, #721b07 100%);
    top: -1px;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
}
.online-player-counter .title {
    color: white;
    font-size: .875rem;
    font-weight: 600;
    text-align: center;
}
.online-player-counter .count {
    color: #E4360D;
    font-size: 1.5625rem;
    font-weight: bold;
    text-align: center;
}


/*
 * СЕКЦИЯ "СЛЕДИ ЗА НОВОСТЯМИ"
 */

.news-section {
    margin-top: 2rem;
    padding: 0;
}

.news-section .section-heading {
    margin-top: 1.25rem;
}


/*
 * ФОРМА РЕГИСТРАЦИИ
 */

.signup-form-section {
    position: relative;
    z-index: 1;

    max-width: 40rem;
    padding: 0 1.25rem;
    margin: 0 auto;
}

.signup-form-section .form-container {
    background-color: #171717;
    box-shadow: 0 0 2.5rem #e4340da9;
    padding: 1.4rem 1.25rem;
    border-radius: 19px;
}

@media (max-width: 370px) {
    .signup-form-section {
        padding-left:  0;
        padding-right: 0;
    }

    .signup-form-section .form-container {
        border-radius: 0;
        padding-left:  .5rem;
        padding-right: .5rem;
    }
}


/* Заголовок */

.signup-form-section .form-heading {
    border: 2px dashed #E4360D;
    box-shadow: 0 0 4px #e4340da9;
    padding: .75rem;

    font-size: 1.25rem;
    font-weight: bold;
    line-height: 1.08;
    text-transform: uppercase;
    text-shadow: 0 0 4px #ffffff77;
}

.signup-form-section .form-heading em {
    color: #E4360D;
    text-shadow: 0 0 4px #e4340da9;
    font-style: normal;
}


.form-dark-2 .form-group {
    margin-top: 1.25rem;
}


/* Обыкновенные input-элементы */

.form-dark-2 input[type="text"],
.form-dark-2 input[type="password"],
.form-dark-2 input[type="email"] {
    color: #d6c6c8;
    background-color: #171717;
    border: 2px solid #4D4645;
    border-radius: 7px;
    font-size: 1.0625rem;
    font-weight: 400;
    padding: 1.15rem;
    width: 100%;
}

.form-dark-2 input::placeholder {
    color: #736B6A;
    font-weight: 400;
}

/* "nice-select" */

.form-dark-2 .nice-select {
  display: flex;
  justify-content: space-between;
  align-items: center;

  height: 3.75rem;
  margin-top: 0;
  margin-bottom: 1rem;

  color: white;
  background-color: #171717;
  border: 2px solid #4D4645;
  border-radius: 7px;
  font-size: .95rem;
}
.form-dark-2 .nice-select::after {
  position: unset;
}


/* "Псевдо-" input-элементы */

.form-dark-2 .pseudo-input {
    height: 3.75rem;
    width: 100%;
    padding: 0 1.15rem;

    display: flex;
    justify-content: space-between;
    align-items: center;

    color: #736B6A;
    background-color: #171717;
    border: 2px solid #4D4645;
    border-radius: 7px;
    font-size: 1.0625rem;
}

.form-dark-2 .pseudo-input .label {
    color: #FFF;
    font-size: .875rem;
    font-weight: 400;
}

.form-dark-2 .pseudo-input .value {
    color: #E4360D;
    font-weight: bold;
}


/* Соглашение об обработке ПД */

.form-group.pii {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    color: #e0e0e0;
    font-size: .75rem;
}

.form-group.pii .col-text {
    max-width: 15rem;
    font-weight: 300;
}
.form-group.pii a {
    color: #E4360D;
}

.form-dark-2 [type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;

    position: relative;

    color: white;

    height: 1.5rem;
    width:  1.5rem;
    border-radius: 2px;

    margin-right: 1rem;
    background: linear-gradient(90deg, #CE0E03 0%, #F75514 100%);
    transform: scale(.75);
}

.form-dark-2 input[type="checkbox"]::before {
    content: "✔";
    position: absolute;
    left: .2rem;
    top: -.1rem;
    visibility: hidden;
    font-size: 1.5rem;
    height: .25rem;
    width:  .25rem;
}
.form-dark-2 input[type="checkbox"]:checked::before {
    visibility: visible;
}

/* Капча */

.form-dark-2 .g-recaptcha {
    margin: 1.25rem auto 0;
    max-width: 304px;
}

/* Submit-кнопка */

.form-dark-2 [type="submit"] {
    margin-top: 1.25rem;
    width: 100%;
}


/*
 * СООБЩЕНИЕ ОБ УСПЕШНОЙ РЕГИСТРАЦИИ
 */

.reg-success-alert {
    display: none;
    z-index: 1001;  /* The usedesk widget has z-index of 1000 */

    min-height: 100vh;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;

    overflow-y: scroll;
    overflow-x: hidden;

    background:
        url('../img/bg_reg_success_alert.png') no-repeat right 0% top 0%/cover,
        black;
}

.reg-success-alert .container {
    min-height: 100%;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;

    color: white;
    padding: 1rem 0 2rem;
}


/* Заголовок */

.reg-success-alert .section-heading em {
    color: #5bc14b;
}


/* Блок с данными регистрации */

.reg-success-alert .reg-data {
    width: 19rem;
    height: 16.8125rem;
    margin: 4rem auto 0;

    background: radial-gradient(42.95% 41.36% at 50% 50%, #7D5050 0%, rgba(9, 10, 9, 0.63) 100%);
    border-radius: 25px;
}

.reg-success-alert .reg-data .icon-checked {
    position: relative;
    top: -40px;
    left: 110px;
    right: 0;
    margin: auto;
}

.reg-success-alert .reg-data-list {
    margin-top: -1rem;
}

.reg-success-alert .reg-data-item {
    margin-top: .5rem;
    font-size: 1.125rem;
    text-align: center;
}

.reg-success-alert .reg-data-item .label {
    font-weight: bold;
}


/* Блок с данными регистрации: краткие инструкции */

.reg-success-alert .note {
    font-size: .75rem;
    text-align: center;
}

.reg-success-alert .note-regdata {
    margin-top: 2rem;
}

.reg-success-alert .note-dwld {
    margin-top: 2rem;
}

.reg-success-alert .close-btn {
    font-size: 3rem;
    font-style: normal;
    position: absolute;
    top: 0;
    right: 1rem;
}


/*
 * ВЕРСИЯ СТРАНИЦЫ ДЛЯ НЕ-ANDROID УСТРОЙСТВ
 */

.unsuitable-device body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-image: url('../img/bg_kremlin_spire.png');
    background-repeat: no-repeat;
    background-size: cover;
 }

.unsuitable-device .main-content {
    color: white;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 0 1.5rem;
 }
    .unsuitable-device .main-content em {
        color: #e4360d;
        font-style: normal;
        font-weight: bold;
    }

.unsuitable-device .instructions {
    max-width: 57.5rem;
    font-size: 2.375rem;
    text-align: center;
 }

.unsuitable-device .qr-code-img {
    margin: 1.5rem auto .75rem;
}

/* Изменяем футер */

.unsuitable-device footer {
    overflow: hidden;
}

.unsuitable-device footer .first-row {
    display: none;
}

.unsuitable-device footer .foot2 {
    background: unset;
    background-color: #000;
}
